<template>
  <div class="">
    <div class="header_box">
      <van-nav-bar :title="task.name" left-arrow @click-left="$router.back()"></van-nav-bar>
      <!--      <x-header class="header" :left-options="{ backText: '', preventGoBack: true }" @on-click-back="clickBack">{{ task.name }}-->
      <!-- <router-link to="/" slot="right">
        <a class="fa fa-home fa-15x"></a>
      </router-link> -->
      <!--      </x-header>-->
    </div>

    <div class="content_box">
      <div class="formBox bzb_style gzbank-style">
        <div v-if="form.type == 'INNER'">
          <ab-custom-form></ab-custom-form>
        </div>
        <div v-if="form.type == 'FRAME'">
          <ab-url-form ref="urlForm" :form="form"></ab-url-form>
        </div>
      </div>
    </div>

    <bpm-buttons v-if="buttons.length>0" :buttons="buttons" class="bzb_style gzbank-style"></bpm-buttons>
    <div v-if="dynamicComponent.show" :is="dynamicComponent.key" @cancel="dynamicComponent.show = false"
         @callback="dynamicComponent.callback" :name="dynamicComponent.name"
         :show-dialog="dynamicComponent.show" :passConf="dynamicComponent.flowParam"></div>
  </div>
</template>

<script>
import Vue from "vue";
import bpmService from "@/service/bpm/bpmService";
import formService from "@/service/form/formService";

export default {
  name: "abCheckbox",
  inject: ["routerRefresh"],
  methods: {
    getTaskData() {
      console.log("on item click");
    },
    clickBack(val) {
      var flowData = this.flowRequestParam;
      // flowData.data = this.busData;
      let obj = this.buttons.find((item) => {
        return item.alias == "reject";
      });
      if (!obj) {
        //如果列表里有驳回用驳回没有用上一步   都没有就回退历史路径
        obj = this.buttons.find((item) => {
          return item.alias == "previous";
        });
      }
      if (!obj) {
        Vue.$router ? this.$router.back() : window.history.back();
        return;
      }
      flowData.action = obj.alias;

      if (!flowData.extendConf) {
        flowData.extendConf = {};
      }
      flowData.extendConf.nodeId = this.$route.query.nodeId;
      flowData.extendConf.carbonId = this.$route.query.carbonId;
      if (val == "1") {
        flowData.extendConf.confirmRecycle = true;
      }

      this.$vux.loading.show({text: "Loading"});
      // 执行动作
      var url =
        Vue.__ctx +
        (flowData.taskId ? "/bpm/task/doAction" : "/bpm/instance/doAction");
      var defer = Vue.baseService.post(url, flowData);
      console.warn("---------------", flowData);
      defer.then(
        (data) => {
          Vue.$vux.loading.hide();
          var that = this;
          //请求错误提示
          if (!data.isOk) {
            this.abTools.alert(data.msg, "");
            if (data && data.code === "30101") {
              // that.routerRefresh() //驳回节点未知刷新数据
              Vue.$router ? this.$router.back() : window.history.back();
            }
            return;
          }

          if (flowData.action === "reject" || flowData.action === "previous") {
            // this.abTools.alert(data.msg, "");
            Vue.$vux.loading.hide();
            setTimeout(() => {
              if (data.data == undefined || data.data == null) {
                that.$router.replace({
                  path: "/bpm/todoTaskList",
                  query: {},
                });
                return;
              }
              //如果又返回taskid
              that.$router.replace({
                path: "/bpm/complateTask",
                query: {
                  taskId: data.data.taskId,
                },
              });
              that.routerRefresh();
            }, 500);
          } else {
            this.abTools.alert(data.msg, "");
            Vue.$vux.loading.hide();
          }

          if (data && data.code === "50103") {
            this.$vux.confirm.show({
              content: data.msg,
              title: "回收任务提示",
              onCancel() {
              },
              onConfirm() {
                that.clickBack("1");
              },
            });
            return;
          }
        },
        function (e) {
          Vue.$vux.loading.hide();
          this.abTools.alert(e.response.data.msg, "错误信息");
        }
      );
    },
  },
  data: function () {
    return {
      task: "",
      instance: "",
      form: "",
      buttons: [],
      flowRequestParam: {}, // 最终提交的数据
      configSpecified: {}, // 流程配置信息
      dynamicComponent: {
        key: "opinion-dialog",
        show: false,
      },
    };
  },
  created: function () {
    this.taskId = this.$route.query.taskId;
    var thisVue = this;
    bpmService.init(
      {taskId: this.taskId, formType: "mobile"},
      function (data) {
        formService.initCustFormFu(data.form.formHtml, data);
        thisVue.form = data.form;
        thisVue.task = data.task;
        thisVue.buttons = data.buttonList;
        thisVue.instance = data.instance;

        if (!data.flowRequestParam.data) {
          data.flowRequestParam.data = data.data;
        }
        thisVue.flowRequestParam = data.flowRequestParam;
        // console.log('flowData ==>',data)
        thisVue.configSpecified = data.configSpecified;
      }
    );
  },
};
</script>

<style lang="less" scoped>
/deep/ .van-nav-bar {
  .van-nav-bar__content {
    height: 4.4rem;
    line-height: 2rem;

    .van-icon {
      color: rgb(50, 50, 51);
      font-size: 2rem;
    }

    .van-nav-bar__title {
      font-size: 1.8rem;
    }
  }
}

.header_box {
  position: fixed;
  width: 100%;
  //height: 46px;
  top: 0;
  z-index: 10;

  .header {
    background: #FFFFFF;
  }
}

.content_box {
  z-index: 1;
  //margin: 5.8rem 1.2rem 7rem 1.2rem;
  margin: 5.8rem 0rem 7rem 0rem;
}
</style>
